<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="black" name="apple-mobile-web-app-status-bar-style">
<meta content="telephone=no" name="format-detection">
<title>登录</title>
<script src="../js/jquery-3.3.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="../js/axios.js"></script>
<script src="https://cdn.bootcss.com/qs/6.5.1/qs.min.js"></script>
<script src="../js/MD5.js"></script>
<script type="text/javascript" src="js/js.js"></script>
<link href="style/login.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div class="ve_title">场馆名称</div>
<div class="main" id="app">
	<div class="login_txt">登录</div>
    <div class="login_type_o">
    	<span style="background-image:url(images/phone.png); color:#0092fd" id="ck_phone" onclick="check_login('phone')">短信登录</span>
        <span style="background-image:url(images/user.png)" id="ck_user"  onclick="check_login('user')">密码登录</span>
    </div>
    <input ref="login_type" id="login_type" type="hidden" value="phone" />
    <input ref="send" id="send" type="hidden" value="60" />
    <div class="login_o" id="phone_login">
    	<div class="login_text">手机号</div>
        <div class="login_input">
        	<input v-model="from1.phone" style="font-size: 14px;" id="phone" type="text" class="phone_input" onkeyup="this.value=this.value.replace(/\D/g,'');" maxlength="11" onafterpaste="this.value=this.value.replace(/\D/g,'')" placeholder="请输入手机号码"/>
        </div>
        <div class="login_text" style="margin-top:10px">短信验证码</div>
         <div class="login_input_code"  style="padding-bottom:3px;">
        	<input v-model="from1.sms_code" style="font-size: 14px;width: 50%;" id="code" type="text" class="code_input" placeholder="请输入验证码" onkeyup="this.value=this.value.replace(/\D/g,'');" maxlength="6" onafterpaste="this.value=this.value.replace(/\D/g,'')" style="width:55%;"/>
            <div class="code_getcode" @click="get_sms_code()" style="float:right;">获取验证码</div>
        </div>
    </div>
    <div class="login_o" id="user_login" style="display:none">
    	<div class="login_text">手机号</div>
        <div class="login_input">
        	<input v-model="from.username" style="font-size: 14px;" id="uphone" type="text" class="phone_input" onkeyup="this.value=this.value.replace(/\D/g,'');" maxlength="11" onafterpaste="this.value=this.value.replace(/\D/g,'')" placeholder="请输入手机号码"/>
        </div>
        <div class="login_text" style="margin-top:10px">密码</div>
        <div class="login_input_code"  style="padding-bottom:3px;">
        	<input v-model="from.password" style="font-size: 14px;" id="upassword" type="password" class="code_input" placeholder="请输入验密码"/>
        </div> 
         <a href="login_set.html" class="login_text" style="margin-top:10px; font-size:13px; text-align:right;"> 设置密码</a>
    </div>
    <div class="login_but_o" @click="gologins()">登录</div>
    <div class="wxlogin"><img src="images/wx2.png" onclick="login_wx()" /></div>	
</div>
</body>
<script>
var app = new Vue({
  el: '#app',
  data: {
    helloData: {},
    from:{
        username: '',
        password: ''
    },
    from1:{
        sms_code: "",
        phone: ""
    }
  },
  methods: {
      //登录
        gologins() {
            sessionStorage.setItem('logo','1')
            if(this.$refs.login_type.value=='user'){
                var obj = this;
                let password=md5(this.from.password)
                password=md5(password)
                console.log(password)
                let from = { username: this.from.username, password: password};
                from =JSON.stringify(from)
                let sign=md5(from)
                let params={
                    from:from,
                    sign:sign
                }
                axios.post('/mobileapi/login_staff.php?act=logingo',
                Qs.stringify(params)).then(function(response){
                    let { msg, code} = response.data
                        if (code !== 200) {
                            _this.$message({
                            message: msg,
                            type: 'error'
                            });
                        } else {
                            var data = response.data
                            console.log(data)
                            sessionStorage.setItem('logo','0')
                            sessionStorage.setItem('token',data.data.Gtoken)
                            window.location.href="../index.html"
                        }
                        
                    }).catch(function (error) { 
                        console.log(error); 
                });
            }else{
                var obj = this
                let from = this.from1
                from =JSON.stringify(from)
                let sign=hex_md5(from)
                let params={
                    from:from,
                    sign:sign
                }
                axios.post('/mobileapi/login_staff.php?act=sms_login',Qs.stringify(params)).then(data => {
                    let { msg, code,user} = data;
                        if (code !== 200) {
                            _this.$message({
                            message: msg,
                            type: 'error'
                            });
                        } else {
                            var data = response.data
                            sessionStorage.setItem('logo','0')
                            sessionStorage.setItem('token',data.data.G_token)
                            window.location.href="../index.html"
                        }
                        
                    }).catch(function (error) { 
                        console.log(error); 
                });
            }
        },
        //获取手机验证码
        get_sms_code(){
            var send=parseInt(this.$refs.send.value);
            if(!isPoneAvailable(this.from1.phone)){
                alert("请输入正确的手机号")
                return false;
            }
            const params={
                phone:this.from1.phone
            }
            if(send==60){
                axios.post('/mobileapi/login_staff.php?act=getsms',Qs.stringify(params)).then(function(response){
                        alert("短信已发，请注意查收")
                    }).catch(function (error) {
                        console.log(error)
                        alert("短信发送失败！请确认手机号是否正确。");
                })   
                var set=setInterval(function(){
                    var send_t=--send;
                    $(".code_getcode").html(""+send_t+"秒");
                    $("#send").val(--send_t)
                }, 1000);
                setTimeout(function(){
                    $(".code_getcode").html("重新获取");
                    $("#send").val(60)
                    clearInterval(set);
                }, 60000);
            }	
        },

        //验证手机号正不争取
        isPoneAvailable($poneInput) {
            var myreg=/^[1][3,4,5,6,7,8,9][0-9]{9}$/;
            if (!myreg.test($poneInput)) {
                return false;
            } else {
                return true;
            }
        }
    }  
})
</script>
</html>